
    <section id="dataCount" class="inline" >
        <section id="usercap" class="cap">
            <div class="campo inline">Nombre Usuario</div>
            <div class="campoImpr inline"><?php echo $username;?></div>            
        </section>
        <section id="emailcap" class="cap">
            <div class="campo inline">Correo</div>
            <div class="inline"><?php echo $email;?></div>
        </section>
        <section id="passwordcap" class="cap">
            <div class="campo formCount inline">password</div>
            <div class="inline">**********</div>
            <a href="#" class="formCount" onclick="editPass();">editar</a>


            <form id="passwordform" style="display:none;" action="account" method="POST">                
                <label for="newpassword">minimo 6</label>
                <input type="password" id="newpassword" name="newpassword" maxlength="12" required/><span id="password_verify" class="verify"></span><br/>
                <label for="con_password">repita el password</label>
                <input type="password" id="con_password" name="con_password" disabled="disabled" required/><span id="confrimpwd_verify" class="verify"></span>
                <label for="password">confirma tu clave</label>
                <input type="password" id="password" name="password" required/>
                <input type="submit" name="submit" value="cambiar clave">
                <input type="button" value="cancelar" id="cancel" onclick="location.href='count'">                
            </form>
            <h1><?php if($request){echo $request;}?></h1>
            
            
        </section>
        
    </section>
<script type="text/javascript">


    function editPass(){
        $('#passwordform').removeAttr('style');
        $('.formCount').remove();
        
    }


    function cancel(){
       $('#passwordform').attr('style','display:none');
    }


$(document).ready(function(){

function verifyPassword(){
        
        if($("#newpassword").val().length <=5)
        {
            $("#password_verify").css({ "background-image": "url('../../images/no.png')" });
            $("#con_password").attr("disabled","disabled");
            }
        else{
            $("#password_verify").css({ "background-image": "url('../../images/yes.png')" });
            $('#con_password').removeAttr('disabled');
            }
        
    }



    function verifyConPassword(){
        
        if($("#con_password").val().length <=6)
        {
            if($("#con_password").val()!=$("#newpassword").val())
            {
                $("#confrimpwd_verify").css({ "background-image": "url('../../images/no.png')" }); 
                
            }
            else{
                $("#confrimpwd_verify").css({ "background-image": "url('../../images/yes.png')" }); 
               
            }
        }
    }
    

    
    $("#newpassword").keyup(verifyPassword);
    $("#newpassword").blur(verifyPassword);
    
    $("#con_password").keyup(verifyConPassword);
    $("#con_password").blur(verifyConPassword);

});


</script>

    <footer >
        <div id="footer_clouli" Style="left:560px"><span class="company">Clouli © 2012</span></div>
    </footer>
</section>
</body>
</html>


